<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/header_com.css">
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./css/navigation_com.css">
    <link rel="stylesheet" href="./css/brand.css">
    <link rel="stylesheet" href="./css/iconfont.css">
    <link rel="stylesheet" href="./css/footer_com.css">
</head>
<body>
    <!--1. the header start -->
    <header>
        <div class="header wrapper">
            <p>ベッドと美しい生活    美好宠物生活</p>
            <h1>pidan</h1>
            <input type="text" class="iconfont" placeholder="&#xe63c">
        </div>
    </header>
    <!--1. the header end -->


    <!--2. the slider start -->
    <div class="slider">
        <img src="./img/images3/banner.png" alt="">
    </div>
    <!--2. the slider end -->


    <!--3. the navigation start -->
    <div class="navigation wrapper">
        <ul>
            <li><a href="./index.html" >首页</a></li>
            <li><a href="./product.html" >产品中心</a></li>
            <li><a href="./brand.html" class="on">品牌故事</a></li>
            <li><a href="./news.html">新闻中心</a></li>
            <li><a href="./special.html">special特别合作</a></li>
            <li><a href="./contract.html">联系方式</a></li>
        </ul>
    </div>
    <!--3. the navgation end -->


    <!--4. the story start  -->
    <div class="story wrapper">
        <h3>品  牌 故 事</h3>
        <div class="right">
            <p>pidan是一家专注为宠物设计产品的品牌。</p>
            <p>pidan秉持「充满善意、富有创造力、勇敢而稳定」的宗旨，立志成为「美好宠物生活」的创造者。</p>
            <p>希望通过pidan的产品和服务，不仅让爱宠人更科学、简单地养宠，</p>
            <p>同时让宠物在与人的共处中，获得更多愉快的体验。</p>
        </div>
    </div>
    <!--4. the story end  -->
    

    <!--5. the big event start  -->
    <div class="event wrapper">
        <h3>pidan大事件</h3>
        <ul>
            <li>
                <span></span>
                <h4>2015年</h4>
                <div class="content">
                    <p>01月	 pidan第一款产品——雪屋猫砂盆正式上线售卖</p>
                    <p>07月	 pidan雪屋猫砂盆获得德国红点奖</p>
                </div>
            </li>
            <li>
                <span></span>
                <h4>2016年</h4>
                <div class="content">
                    <p>01月	 pidan第一款产品——雪屋猫砂盆正式上线售卖</p>
                    <p>07月	 pidan雪屋猫砂盆获得德国红点奖</p>
                </div>
            </li>
            <li>
                <span></span>
                <h4>2017年</h4>
                <div class="content">
                    <p>05月	 pidan产品入驻全球各大电商平台</p>
                    <p>06月	 pidan与25个国家经销商合作，产品销往世界各地</p>
                </div>
            </li>
            <li>
                <span></span>
                <h4>2018年</h4>
                <div class="content">
                    <p>05月	 第一批pidan犬用产品——森林迷宫慢食碗、冰山斜口碗和火山防溢碗上线</p>
                    <p>07月	 品牌全新升级，确立全宠物品类品牌战略方向以及“美好宠物生活”的品牌使命</p>
                    <p>09月	 pidancare业务正式上线</p>
                    <p>12月	 pidan动物脊背品牌体验店开业</p>
                </div>
            </li>
            <li>
                <span></span>
                <h4>2019年</h4>
                <div class="content">
                    <p>03月	 pidan宠物隧道地毯获得第二个德国红点奖</p>
                    <p>09月	 pidan store杭州来福士店开业</p>
                    <p>10月	 pidan宠物随行杯获得日本优良设计大奖</p>
                    <p>12月	 pidan store南京金鹰新街口店、成都悠方店开业</p>
                </div>
            </li>
            <li>
                <span></span>
                <h4>2020年</h4>
                <div class="content">
                    <p>2月	pidan缓冲牵引绳、pidan水奥义碗获得德国IF设计奖</p>
                    
                </div>
            </li>
        </ul>
    </div>
    <!--5. the big event end  -->


    <!--6. the gays count start -->
    <div class="gays">合作伙伴遍布全球4000+间</div>
    <!--6. the gays count end -->


    <!--7. the introduce start -->
    <div class="introduce wrapper">
        <img src="./img/images3/banner2.png" alt="">
        <p>pidan的第一家体验店名为“动物脊背”，寓意“与动物一起承载历史的重量”。</p>
        <p>pidan体验店内集合了产品零售、艺术展示、动物关怀等美好生活元素，期望将品牌体验和理念传递做到极致。</p>
        <p>pidan希望每一位进店的顾客，除了享受便利的产品购买，更可以与动物一同穿梭其中,</p>
        <p>在人和动物各自拥有活动空间的同时，也能在彼此交互的空间内感受到舒适和自由。</p>
        <p>上海「动物脊背」品牌体验店</p>
        <p>地址：上海市虹口区沙泾路10号</p>
        
    </div>
    <!--7. the introduce end -->

    <!--8. the offline start  -->
    <div class="offline wrapper">
        <h3>线下门店</h3>
        <ul>
            <li><img src="./img/images3/offline1.png" alt=""><p>独角兽宠物 </p><span>成都</span></li>
            <li><img src="./img/images3/offline2.png" alt=""><p>Oscat奥斯卡猫 </p><span>北京</span></li>
            <li><img src="./img/images3/offline3.png" alt=""><p>Mr.Pet宠先生  </p><span>厦门</span></li>
            <li><img src="./img/images3/offline.png" alt=""><p>peypet日记  </p><span>深圳</span></li>
        </ul>
        <div class="more"><button>more</button></div>
    </div>
    <!--8. the offline end  -->

    <!-- the footer start -->
    <div class="footer wrapper">
        <p>沪ICP备12385496-3 sdhfnhrj©2020 Danke Co</p>
        <p>服务热线：+86 400-920-0674</p>
    </div>
    <!-- the footer end -->





</body>
</html>